<!DOCTYPE html>	
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<style>
		table {
			border-collapse: collapse;
			width: 100%;
			max-width: 800px;
			margin: 0 auto;
			font-size: 1.1em;
			font-family: Arial, sans-serif;
		}

		th {
			background-color: #f2f2f2;
			color: #333;
			text-align: left;
			padding: 12px;
		}

		td {
			border: 1px solid #ddd;
			padding: 8px;
		}

		tr:nth-child(even) {
			background-color: #f9f9f9;
		}

		tr:hover {
			background-color: #f5f5f5;
		}

		@media only screen and (max-width: 600px) {
			table {
				font-size: 0.9em;
			}
		}
	</style>
</head>

<body>
	<table>
		<thead>
			<tr>
				<th>姓名</th>
				<th>年龄</th>
				<th>性别</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>张三</td>
				<td>25</td>
				<td>男</td>
			</tr>
			<tr>
				<td>李四</td>
				<td>30</td>
				<td>女</td>
			</tr>
			<tr>
				<td>王五</td>
				<td>40</td>
				<td>男</td>
			</tr>
		</tbody>
	</table>
</body>
<script>

</script>

</html>